<template>
  <div class="body" v-loading="loading">
    <div class="title">以下内容为系统设置参数，修改前请仔细确认</div>
    <el-form ref="configForm" size="small" :model="form" label-width="100px">
      <div class="row">
        <el-form-item label="服务地址" prop="url" :rules="[{ required: true, trigger:['blur', 'change'], message: '请输入此项内容' } ]">
          <el-input size="small" v-model="form.url" placeholder="请输入服务地址" maxlength="100"></el-input>
        </el-form-item>
        <div class="comment">填写/k3cloud/以及之前的url地址</div>
      </div>
      <div class="row">
        <el-form-item label="数据中心" prop="dataCenter" :rules="[{ required: true, trigger: 'change', message: '请输入此项内容' } ]">
          <el-input size="small" v-model="form.dataCenter" placeholder="请输入数据中心" maxlength="50"></el-input>
        </el-form-item>
        <div class="comment">请填写数据中心ID</div>
      </div>
      <div class="row">
        <el-form-item label="访问账号" prop="account" :rules="[{ required: true, trigger: 'change', message: '请输入此项内容' } ]">
          <el-input size="small" v-model="form.account" placeholder="请输入访问账号" maxlength="50"></el-input>
        </el-form-item>
        <div class="comment">默认访问账号</div>
      </div>
      <div class="row">
        <el-form-item label="密码" prop="password" :rules="[{ required: true, trigger: 'change', message: '请输入此项内容' } ]">
          <el-input size="small" v-model="form.password" placeholder="请输入密码" maxlength="50"></el-input>
        </el-form-item>
        <div class="comment">默认访问账号密码</div>
      </div>
      <div class="row">
        <el-form-item label="语言" prop="lang" :rules="[{ required: true, trigger: 'change', message: '请输入此项内容' } ]">
          <el-input size="small" v-model="form.lang" placeholder="请输入语言" maxlength="50"></el-input>
        </el-form-item>
        <div class="comment">语言, 默认为2052</div>
      </div>
    </el-form>
    <div class="button">
      <el-button type="warning" size="small" @click="revertToDefault" icon="el-icon-back">恢复默认值</el-button>
      <el-button type="success" size="small" @click="getConfig(true)" icon="el-icon-refresh">刷新</el-button>
      <el-button type="primary" size="small" @click="updateConfig" icon="el-icon-check">设定保存</el-button>
    </div>
  </div>
</template>

<script>
import { onMounted, ref, getCurrentInstance } from 'vue'
export default {
  name: 'ws_config',
  components: {
  },
  data() {
    return {
    }
  },
  setup() {
    const { proxy } = getCurrentInstance()
    const loading = ref(false)
    const form = ref({ })
    const defaultValue = ref({ })

    const getDefaultValue = async () => {
      let dict = await proxy.$api.getChildDictionaryListByKeys({ keys: [ "default_config" ] })
      let defaultValueList = dict.default_config || []
      let temp = {}
      for(let i = 0; i < defaultValueList.length; i++) {
        temp[ defaultValueList[i].key ] = defaultValueList[i].name
      }
      defaultValue.value = temp
    }

    // 更新系统当前配置
    const updateConfig = async () => {
      proxy.$refs.configForm.validate(async (valid) => {
        if (!valid) return;
        try {
          await proxy.$confirm(`确认更新吗?`, '确认', {
            confirmButtonText: '确认',
            cancelButtonText: '取消',
            type: 'warning'
          })
        } catch (e) {
          return;
        }
        loading.value = true
        try {
          let res = await proxy.callApi('save_config_kingdee', form.value)
          if (!res.res) return
          proxy.$message.success('已经保存!')
        } finally {
          loading.value = false
        }
      })
    }

    // 恢复默认值
    const revertToDefault = async() => {
      try {
        await proxy.$confirm(`确认恢复吗?`, '确认', {
          confirmButtonText: '确认',
          cancelButtonText: '取消',
          type: 'warning'
        })
      } catch (e) {
        return;
      }
      Object.assign(form.value, defaultValue.value)
    }

    // 获取系统当前配置
    const getConfig = async (refresh) => {
      if (refresh) {
        try {
          await proxy.$confirm(`确认刷新吗?`, '确认', {
            confirmButtonText: '确认',
            cancelButtonText: '取消',
            type: 'warning'
          })
        } catch (e) {
          return;
        }
      }
      loading.value = true
      try {
        let res = await proxy.callApi('get_config_kingdee')
        if (!res.res) return
        form.value = res.kingdee
      } finally {
        loading.value = false
      }
    }

    onMounted(() => {
      getDefaultValue()
      return getConfig()
    })

    return {
      loading,
      form,
      defaultValue,
      updateConfig,
      revertToDefault,
      getConfig
    }
  }
}
</script>

<style scoped lang="scss">
.body {
  padding: 20px;
  font-size: 14px;
  .title {
    margin-bottom: 20px;
    color: red;
  }
  .row {
    display: flex;
    .el-form-item {
      width: 400px;
    }
    .comment {
      line-height: 32px;
      color: var(--el-text-color-regular);
      margin-left: 10px;
    }
  }
  .button {
    margin-left: 100px;
  }
}
</style>
